import { Component, OnInit } from '@angular/core';
import { UploadFileServer } from 'src/app/core/service/uploadFile.service';
import { ApiService, urlService } from 'src/app/core/api';
import { Router } from '@angular/router';
import { MessageService } from 'src/app/core/service';
import { LayoutRourteStatus } from 'src/app/model/status';
import { MemberService } from '../../../member.server';

@Component({
    selector: "my-edit-img",
    templateUrl: './edit-img.component.html',
    styleUrls: ['./edit-img.scss']
})
export class EditImgComponent implements OnInit {
    constructor(
        private api: ApiService,
        private msg_1: MessageService,
        private _upload: UploadFileServer,
        private router: Router,
        private memberServer: MemberService
    ) {}
    private _layoutRourteStatus: LayoutRourteStatus = {
        url: '/member/center/account',
        manu2Url: '/member/center/account/info',
        breadcrumbs: [{tragetTitle: '账户中心', breadcrumbUrl: '/member/center/account/info'}, { tragetTitle: '上传头像' }]
    };
    url = 'account';

    loading = false;
    isLoading = false;
    isShowFImg = true;
    /**
     * test img-cropper
     *
     */
    imageChangedEvent: any = '';
    croppedImage: any = '';
    selFile: any;
    /** end------------------------------ */
    /* 更新图片 */
    bigurl: any;

    private _imgURL: string;

    ngOnInit() {
        this.msg_1.sendLayoutRourteStatus(this._layoutRourteStatus);
        this.accountInfo({});
    }
    async accountInfo(data) {
        const teg = await this.memberServer.getAJX('商户详情', data);
        if (teg.status === 0) {
            this._imgURL = teg.data.merchantInfo.shopLogo;
        }
    }
    fileChangeEvent(event: any): void {
        if (event.target.files.length > 0) {
            this.imageChangedEvent = event;
            this.isShowFImg = false;
        }
    }
    imageCropped(image: any) {
        this.croppedImage = image;
    }
    imageLoaded() {
        // show cropper
    }
    loadImageFailed() {
        // show message
    }
    public uploadImage(e) {
        const image = this.imageChangedEvent.target.files[0];
        // const image = e.target.files[0];
        this.isLoading = true;
        this._upload
            .uploadImage(urlService('dev', '商户上传logo'), image, this.croppedImage.base64)
            .then(response => {
                this._imgURL = response['data'].image;
            })
            .then(() => {
                this.isLoading = false;
                this.router.navigateByUrl('/member/center/account/info');
            })
            .catch(err => console.log(err));
    }
    private _successListOk(data): void {
        this._imgURL = data.image;
    }
    private _getAJX(url: string, data: any): any {
        // 接口交換
        const success = this.api.post(urlService('dev', url), data).toPromise();
        return success;
    }
}
